<!-- comment -->
<!DOCTYPE html>
<html chrome_comp_test="document_type_and_boxsizing">
<head>
</head>
<body>
<h1>RD8001</h1>
<p>1. [DIV] border:10px; padding:10px; width:100px; height:100px;</p>
<div style="width:200px; overflow:hidden;">
<div style="border:10px solid; padding:1px; margin:0; width:100px; height:100px; float:left;" expectedProblems="RD8001">DIV</div>
</div>
<br />

<p>2. [INPUT] border:10px solid; width:100px; height:100px; box-sizing:content-box;</p>
<div style="text-align:center; width:110px;">
<input type="reset" style="border:10px solid; width:100px; height:100px; box-sizing:content-box;" expectedProblems="RD8001" />
</div>
<br />

<p>3. [HR] border:10px solid; width:100px; height:100px;</p>
<hr style="border:10px solid; width:100px; height:100px;" align="left" expectedProblems="RD8001" />
<br />

<p>4. [INPUT] border:10px solid black; width:100px; height:100px;</p>
<div>
<input type="text" style="border:10px solid black; width:100px; height:100px;" expectedProblems="RD8001" />
</div>
<br />

<p>5. [OBJECT] border:30px solid; width:100px; height:100px;</p>
<div>
<object data="img.png" style="width:100px; height:100px; border:30px solid;" expectedProblems="RD8001"></object>
</div>


<h2>The followings don't have problems</h2>
<p>A1. [IMG] border:10px; width:100px; height:100px;</p>
<div>
<img src="img.png" style="border:10px; width:100px; height:100px;" />
</div>

<p>A2. [DIV] border:10px; padding:10px; width:auto; height:auto;</p>
<div style="border:10px solid; padding:10px; width:auto; height:auto;">DIV</div>
<br />

<p>A3. [DIV] border:0; padding:0; width:100px; height:100px;</p>
<p style="border:0; padding:0; margin:0; width:100px; height:100px;">P</p>
<br />

<p>A4. [PRE] border:10px; padding:10px; width:100px; height:100px; -webkit-box-sizing:border-box;</p>
<pre style="border:10px solid; padding:10px; margin:0; width:100px; height:100px; -webkit-box-sizing:border-box;">PRE</pre>
<br />

<p>A5. [BLOCKQUOTE] padding:10px; width:100px; height:100px; box-sizing:border-box;</p>
<blockquote style="padding:10px; margin:0; width:100px; height:100px; box-sizing:border-box;">BLOCKQUOTE</blockquote>
<br />

<p>A6. [BUTTON] border:10px solid; width:100px; height:100px;</p>
<div>
<button style="border:10px solid; width:100px; height:100px;">BUTTON</button>
</div>
<br />

<p>A7. [TABLE] border:10px solid; width:100px; height:100px; -webkit-box-sizing:content-box;</p>
<table style="border:10px solid; width:100px; height:100px; -webkit-box-sizing:content-box;">
	<tr>
		<td>TABLE</td>
	</tr>
</table>
<br />

<p>A8. [IMG] border:10px solid; width:100px; height:100px;</p>
<div>
<img style="border:10px solid; width:100px; height:100px;" src="img.png" />
</div>
<br />

<p>A9. [INPUT] border:10px solid black; width:100px; height:100px; box-sizing:border-box;</p>
<div>
<input type="password" value="PASSWORD" style="border:10px solid black; width:100px; height:100px; box-sizing:border-box;" />
</div>
<br />

<p>A10. [IFRAME] border:10px solid; width:100px; height:100px;</p>
<div>
<iframe src="about:blank" style="border:10px solid; width:100px; height:100px;"></iframe>
</div>

<p>A11. [EMBED] width:100px; height:100px;</p>
<div>
<embed src="flash_object_embed_1.swf" type="application/x-shockwave-flash" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" style="width:100px; height:100px;" />
</div>

<p>A12. [DIV] border:1px; padding:3px; width:100px; height:100px;</p>
<div style="width:200px; overflow:hidden;">
<div style="border:1px solid; padding:3px; margin:0; width:100px; height:100px; float:left;">DIV</div>
</div>

</body>
</html>